@import '../../../styles/_commonColor.scss';

.mailingAddress{
  .title{
    padding: 56px  30px 20px;
    font-size: 26px;
    color: $darkgray;
  }
  .envelope{
    background: $white;
    padding: 48px 30px 48px 30px;
    position: relative;
    word-break: break-all;
    min-height: 190px;
    .right_arr{
      position: absolute;
      right: 30px;
      width: 18px;
      height: 26px;
      top: 50%;
      margin-top: -13px;
    }
    &:after{
      position: absolute;
      bottom: 0;
      left: 0;
      right: 0;
      content: '';//有content，伪元素才会显示出来
      background: url("../../../images/envelopels.png") no-repeat center;//通过伪元素的背景添加图片路径 ，no-repeat->不重复 center->居中表示
      display: block;    //也可以是inline-bolck但是主要是block的特性才能设置宽高
      width: 100%;    //kuan宽
      height: 6px;
      background-size: 100%;
    }
    &:before{
      position: absolute;
      top: -1px;
      left: 0;
      right: 0;
      content: '';//有content，伪元素才会显示出来
      background: url("../../../images/envelopels.png") no-repeat center;//通过伪元素的背景添加图片路径 ，no-repeat->不重复 center->居中表示
      display: block;    //也可以是inline-bolck但是主要是block的特性才能设置宽高
      width: 100%;    //kuan宽
      height: 6px;
      background-size: 100%;
    }
    &.noData_box{
      min-height: 286px;
    }
    .add_box{
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      align-items: center;
      .add_img{
        width: 174px;
        height: 174px;
      }
      .add_information{
        p{
            font-size: 32px;
            color: $black;
            padding: 14px 0 14px 0;
            text-align: center;
          
        }
      }
    }
    .name_a{
      padding-bottom: 8px;
      &:after{
        content: '';
        display: table;
        clear: both;
      }
      position: relative;
      span{
        font-size: 32px;
        color: $black;
        &:first-child{
          float: left;
        }
        &:last-child{
          float: right;
          position: relative;
          right: 60px;
        }
      }
    }
    .address{
      font-size: 26px;
      color: $darkgray;
      line-height: 38px;
      padding-right: 60px;
    }
  }

  .title_b{
    background: $white;
    font-size: 30px;
    color: $darkgray;
    margin-top: 24px;
    padding: 24px 30px;
    border-bottom: 1PX solid $bordergray;
  }
  .autonomous{
    &:after{
      content: '';
      display: table;
      clear: both;
    }
    margin: 34px 30px 0 30px;
    .careful{
      width: 24px;
      height: 24px;
      float: left;
      margin-top: 5px;
    }
    .explain_b{
      float: left;
      width: 95%;
      font-size: 26px;
      line-height: 38px;
      color: $gray;
      padding-left: 10px;
    }
  }
  .mailingType{
    background: $white;
    padding-left: 30px;
    position: relative;
    &:after{
      content: '';
      display: table;
      clear: both;
    }
    .name_list{
      //display: flex;
      //align-items: center;
      padding: 30px 30px 30px 0;
      position: relative;
      &:after{
        content: '';
        display: table;
        clear: both;
      }
      &:first-child{
        border-bottom: 1PX solid $bordergray;
      }
      .choice_img{
        float: left;
        width: 48px;
        height: 48px;
        position: absolute;
        top: 50%;
        margin-top: -24px;
      }
      .name_choice{
        width: 88%;
        float: right;
        text-align: justify;
        &.canNotClick{
          p{
            color: $bordergray;
          }
        }
        p{
          &:first-child{
            font-size: 30px;
            color: $black;
            padding-bottom: 22px;
          }
          &:last-child{
            font-size: 26px;
            color: $gray;
            line-height: 38px;
          }
        }
      }
    }
  }

  .btn_box{
    padding: 0 30px;
    .btn_inspection{
      font-size: 34px;
      color: $white;
      background-color: $blue;
      margin: 50px 0 50px 0;
      border: none!important;
      border-radius: 6px;
    }
  }
  .btn_box_bottom{
    position: fixed;
    left: 0;
    right: 0;
    bottom: 60px;
  }


}
